vue spa单页面应用,在jssdk鉴权ios只有首次鉴权生效,其他页面鉴权无效

您所在的位置:网站首页 aka鉴权 mac vue spa单页面应用,在jssdk鉴权ios只有首次鉴权生效,其他页面鉴权无效

vue spa单页面应用,在jssdk鉴权ios只有首次鉴权生效,其他页面鉴权无效

2023-05-06 16:50| 来源: 网络整理| 查看: 265

微盟微盟2021-04-05

加粗

标红

插入代码

插入链接

插入图片

上传视频

请 登录 后发表内容 关闭新增或编辑超链接确认取消关闭插入视频确认取消发表

既然IOS仅可使用第一次进入应用的URL来签名,那么在vuex上缓存一个微信签名URL,IOS保存第一次进入应用的URL,Android则缓存为每个页面的URL。签名时,直接从缓存拿出签名URL来处理。

// 全局判断是否IOS方法 function isIos(){ const u = navigator.userAgent; return u.indexOf("iPhone") > -1 || u.indexOf("Mac OS") > -1; }

 定义vuex缓存

{ state: { wechatSignUrl: "" }, mutations: { setWechatSignUrl(state, wxSignUrl) { // 关键点 // IOS仅记录第一次进入页面时的URL // IOS微信切换路由实际URL不变,只能使用第一进入页面的URL进行签名 if (isIos() && state.wxSignUrl !== '') { return; } state.wxSignUrl = wxSignUrl; } }, getters: { getWechatSignUrl: (state) => state.wxSignUrl } }

关键点在于设置更新微信签名URL判断的地方:首次进入应用页面的时候肯定会触发更新,若是IOS且签名URL已经设置过了,那么就不需要更新设置了,只要不退出或刷新应用,缓存永远都会是首次进入页面URL。

路由守卫内触发更新签名URL

import store form "@/stores" // 获取真实有效微信签名URL function getWechatSignUrl(to){ if(isIos()) { return window.location.href; } else { // 此处$appHost需要自行处理 return $appHost + to.fullPath } } ... $router.beforeEach((to, from, next) => { store.commit("setWechatSignUrl", getWechatSignUrl(to)); }) ...

在路由守卫内更新签名URL,保证IOS是使用当前页面URL,Android是使用目标路由完整地址再加上域名

使用签名URL调用JSSDK API

在使用JSSDK API的页面通过vuex取出缓存的微信签名URL,然后进行签名。

import store form "@/stores" ... { methods: { initWechatShareConfig() { const that = this; const wxSignUrl = store.getters['getWechatSignUrl']; const wxShareConfigs = { // 微信分享配置 } // 初始化微信分享 $wechat.share(wxSignUrl, wxShareConfigs); } } }

你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。

待楼主反馈2021-04-05有用 1回复 1木子水心木子水心2021-04-08

加粗

标红

插入代码

插入链接

插入图片

上传视频

请 登录 后发表内容 关闭新增或编辑超链接确认取消关闭插入视频确认取消发表亲测,有效感谢!

你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。

待楼主反馈2021-04-08赞 回复关闭请选择投诉理由广告内容违法违规恶意灌水内容其他关闭请选择投诉理由广告内容违法违规恶意灌水内容其他


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3